import Taro, { Component } from '@tarojs/taro'
import { View , Text , Image} from '@tarojs/components';
import { baseImgSrc } from '../../util/base_url';
import { getOftenAddress } from '../../util/api';
import NoData from '../../components/nodata/nodata';
import './oftenaddress.scss';
export default class OftenAddress extends Component {
    constructor(){
        super(...arguments)
        this.state = {
            list:[],
            total:0,
        }
    }
    componentDidShow(){
        getOftenAddress().then( res => {
            this.setState({list:res.data});
        })
    }
    toAddress(){
        Taro.navigateTo({
            url:`/pages/oftenaddressadd/oftenaddressadd?model=add`,
        })
    }
    editAddress(id,e){
        console.log(e)
        e.stopPropagation();
        Taro.navigateTo({
            url:`/pages/oftenaddressadd/oftenaddressadd?model=edit&id=${id}`,
        })
        return false
    }
    addressSelect(item){
        Taro.eventCenter.trigger('addressSelect',{address:item.address,latitude:item.lat,longitude:item.lon},
                                                 {address:item.go_address,latitude:item.go_lat,longitude:item.go_lon})  
        Taro.navigateBack();
    }
    render(){
        let { list } = this.state;
        return(
            <View className='oftenaddress'>
                {
                    list.map( (v,i) => (
                        <View className='oa-item flex align-items space-between' onClick={this.addressSelect.bind(this,v)}>
                            <View className='left flex1'>
                                <View className='left-it flex align-items flex-start'>
                                    <Image className='it-image' src={`${baseImgSrc}/address_fa.png`} />
                                    <Text className='it-txt ell1 flex1'>{v.address}</Text>
                                </View>
                                <View className='left-it flex align-items flex-start'>
                                    <Image className='it-image' src={`${baseImgSrc}/address_dao.png`} />
                                    <Text className='it-txt ell1 flex1'>{v.go_address}</Text>
                                </View>
                            </View>
                            <Image className='edit' src={`${baseImgSrc}/edit.png`} onClick={this.editAddress.bind(this,v.id)} />
                        </View>
                    ))
                }
                <NoData needShow={list.length == 0} />
                <View className='add-btn fn-ctr' onClick={this.toAddress.bind(this)}>
                    <Image className='add-image' src={`${baseImgSrc}/add_btn.png`} />
                    <Text className='add-txt'>添加常用地址</Text>
                </View>
            </View>
        )
    }
}